<template>
  <div class="icons">
    <div class="icon" v-for="item of list" :key="item.id">
      <div class="icon-img">
        <img src="https://mp-piao-admincp.qunarzz.com/mp_piao_admin_mp_piao_admin/admin/20209/feac0f0a895cbc7c49920238529ca6e7.png" alt="">
      </div>
      <div class="txt">名称</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'HomeIcons',
  props: ['list']
}
</script>

<style lang="stylus" scoped>
  @import "~styles/varibles.styl"
  @import "~styles/mixins.styl"
  .icons
    height 25vw
    padding .16rem 0
    .icon
      float left
      width 25vw
      height 25vw
      .icon-img
        width 1.1rem
        height 1.1rem
        margin .18rem auto 0
        img
          width 100%
          height 100%
      .txt
        margin-top .12rem
        padding 0 .2rem
        color $darkColor
        text-align center
        ellipsis()
</style>
